<template>
  <div class="LoginQingkuang">
    <div class="title">
      <div>登录情况统计</div>
      <div class="butexp">
        <TopTile  @command="command" @daochu="daochu" @shuaxin="shuaxin"></TopTile>
      </div>
    </div>
    <div class="table">
      <TableColumn
        ref="tabledata"
        :tableData="tableData" 
        :tableConfig="tableConfig" 
        :issize="issize">
      </TableColumn>
    </div>              
  </div>
</template>

<script>
import {getdenglutongjiapi} from '@/api/system/LoginSituation'
import TableColumn from '@/components/Table/index.vue'
import {exportexcel} from '@/utils/excel'
import TopTile from '@/components/TopTitle/index.vue'
export default {
  name: 'CallPoliceLoginChaxun',
  components: {
    TopTile,
    TableColumn
  },
  props:{
    value1: {
      type:Array
    }
  },
  data() {
    return {
      issize:'medium',
      tableData: [],
      tableConfig: [
        { label: '序号', type: 'index', width: '70', center: 'center' },
        {label:'登录账号',prop:'userNo' },
        {label:'账号名称',prop:'loginAccount'},
        {label:'登录次数',prop:'loginCount',center: 'right'},
        {label:'最后登录时间',prop:'lastLogonTime' ,center: 'center'},
      ]
    };
  },

  mounted() {
    
  },

  methods: {
    // 获取表格数据
    async getchaxunlist(time) {
      this.$refs.tabledata.loading=true
      const { data: { list } } = await getdenglutongjiapi({
        startTime:time[0],endTime:time[1]
      })
      this.tableData=list
      this.$refs.tabledata.loading=false
    },
    // 调节表格密度
    command(val) {
      if (val === '默认') {
        this.issize = 'medium'
      } else if (val === '中等') {
        this.issize = 'small'
      } else {
        this.issize = 'mini'
      }
    },
    // 导出
    daochu() {
      exportexcel('sst-microservice-biz/sst/user/logon/message/countExport',{
        startTime:this.value1[0],endTime:this.value1[1]
      },'登录情况统计')
    },
    // 刷新列表
    shuaxin() {
      this.getchaxunlist(this.value1)
      this.$message.success('列表刷新成功')
    },
  },
};
</script>

<style scoped>
.LoginQingkuang{
  height: 100%;
  .title{
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
      .butexp{
        display: flex;
        .moban{margin-right: 10px;}
      }
  }
  .table{
      height: 94%;
  }
}
</style>